﻿/* -------- Pop Panel Class By Desmond ------------------ */

/* ======== Panel ========= */
var Panel = Class.create()
Panel.prototype = {
	initialize: function(id,title,panelclass,dragable,eventObj){//container id , title of panel , panel class , dragable , event Object
		this.id 		= id;
		this.titletext	= title || "";
		this.dragable	= dragable || false;		
		this.dragrange	= null;
		
		this.container  = document.createElement("div");
		this.head		= document.createElement("div");
		this.content	= document.createElement("div");
		this.title	 	= document.createElement("span");
		this.btnclose	= document.createElement("div");
		this.movebar	= document.createElement("div");		
		this.shadow		= document.createElement("div");		
		
		this.iframe 	= document.createElement("iframe");
		
		this.eventObj	= eventObj;
		
		this.title.innerHTML 		= this.titletext;
		this.container.id			= this.id;
		this.container.className 	= panelclass;
		
		this.head.className 		= "head";
		this.content.className 		= "content";
		this.btnclose.className 	= "close";
		if(_isOpera){
			this.movebar.setAttribute("style","position:absolute;left:0;top:0;height:20px;width:80%;");		
			this.shadow.setAttribute("style","position:absolute;left:2px;top:2px;width:100%;z-index:-1;");
		}else{			
			this.movebar.style.cssText 	= "position:absolute;left:0;top:0;height:20px;width:80%;"		
			this.shadow.style.cssText   = "position:absolute;left:2px;top:2px;width:100%;z-index:-1;";
		}
		this.container.appendChild(this.shadow);
		this.head.insertBefore(this.title,null);
		this.head.insertBefore(this.movebar,null);
		this.head.insertBefore(this.btnclose,null);
		this.container.insertBefore(this.head,null);
		this.container.insertBefore(this.content,null);
				
		if(_isIE){
			this.iframe.setAttribute("frameborder","0");
			this.iframe.src				="javascript:false;"
			this.iframe.style.cssText 	= "color:#ffffff;width:100%;height:100%;background:#ffffff;border:none;filter:alpha(opacity=0)"
			
			this.shadow.insertBefore(this.iframe,null);
			this.iframe.style.height 	= this.container.offsetHeight + "px";
			
			var _setiframeheight = function(){
				this.iframe.style.height = this.container.offsetHeight + "px";
			}.bind(this)
			//var iframeinterval = setInterval(_setiframeheight,100);
		}
		
 		this.addTopPage();
		
		if(this.dragable){			
			this.movebar.onmousedown = function(event){
				this.dragrange = this.setDragRange();
				CommonFunctions.startDrag(event,this.container,this.dragrange);				
			}.bind(this);
			this.movebar.onmouseup = function(event){
				CommonFunctions.stopDrag(event);
			}.bind(this);
		}
		
		this.container.onclick 	= function(){
		}.bind(this);
		
		this.btnclose.onclick 	= function(){	
			this.closePanel();
		}.bind(this);
	},
	setDragRange:function(){
		var innersize = CommonFunctions.getInnerSize();
		var scrollsize = CommonFunctions.getScrollSize();
		if(_isIE)
			range = [scrollsize[0],scrollsize[0] + innersize[0]-this.container.offsetWidth-22,scrollsize[1],scrollsize[1] + innersize[1]-this.container.offsetHeight-8];
		else
			range = [scrollsize[0],scrollsize[0] + innersize[0]-this.container.offsetWidth,scrollsize[1],scrollsize[1] + innersize[1]-this.container.offsetHeight];	
		return range;
	},
	
	setAbsPoint: function(e){
		this.container.style.display = "";
		var w = this.container.offsetWidth;
		var h = this.container.offsetHeight;
		this.container.style.display = "none";
		var o;
		if(this.eventObj){
			o = this.getAbsPoint(this.eventObj);
			o.y = o.y + this.eventObj.offsetHeight;
			
		}else{
			var innersize = CommonFunctions.getInnerSize();			
			if(_isIE || window.navigator.userAgent.indexOf('Firefox/3') > -1)
			{
				o = {x:(innersize[0]-w)/2,y:(innersize[1]-h)/2 + CommonFunctions.getScrollSize()[1]};
			}
			else
			{
				o = {x:(innersize[0]-w)/2,y:(innersize[1]-h)/2};	
			}
			//alert((innersize[1]-h)/2);
		}
		this.container.style.left 	= o.x + "px";
		
		this.container.style.top 	= o.y + "px";
		
	},
	getAbsPoint: function(e){
		return CommonFunctions.getAbsPoint(e);	
	},
	changeTitle:function(str){
		this.titletext = str;
		this.title.innerHTML = this.titletext;
	},
	addTopPage:function(){
		if(this.container)
			document.body.appendChild(this.container);	
	},
	show:function(){
		this.container.style.display = "";
	},
	hide:function(){
		this.container.style.display = "none";
	},
	openPanel:function(){
		this.setAbsPoint();
		this.show();
		this.openHandler();
	},
	closePanel:function(){		
		this.hide();
		this.closeHandler();
		
	},
	openHandler:Function,
	closeHandler:Function			
}

/* ======== Mask Panel ========= */
var MaskPanel = Class.create();
MaskPanel.prototype = {
	initialize:function(id,mclass,alpha){
		this.container = document.createElement("div");
		this.iframe	= document.createElement("iframe");
		this.container.className = mclass;
		//alert(document.body.offsetHeight + "-" + CommonFunctions.getInnerSize())
		//this.container.style.height = (document.documentElement.offsetHeight)<screen.height?screen.height:(document.documentElement.offsetHeight) + "px";
		var h = document.body.offsetHeight>document.documentElement.offsetHeight?document.body.offsetHeight:document.documentElement.offsetHeight;

		this.container.style.height = (h + 20) + "px";
		if(alpha != null){
			if(_isIE){
				this.container.style.filter = "alpha(opacity=" + alpha + ")";
			}else{
				this.container.style.opacity = "." + alpha;	
			}
		}
		if(_isIE){
			this.iframe.src				="javascript:false;"
			this.iframe.style.cssText 	= "color:#ffffff;width:100%;height:100%;background:#ffffff;border:none;filter:alpha(opacity=0);";
			this.container.insertBefore(this.iframe,null);
		}
		document.body.appendChild(this.container);
		this.container.style.display = "none";		
	},
	show:function(){
		this.container.style.display = "";	
		this.resetHeight();
		document.documentElement.style.overflow = "hidden";
	},
	hide:function(){
		this.container.style.display = "none";
		document.documentElement.style.overflow = "";
	},
	resetHeight: function(){
		var h = document.body.offsetHeight>document.documentElement.offsetHeight?document.body.offsetHeight:document.documentElement.offsetHeight;
		this.container.style.height = (h + 20) + "px";
	}
}
/* ======== Modal Panel ========= */
var ModalPanel = Class.create();
ModalPanel.prototype = Object.extend(Panel.prototype,{
	maskpanel:null,
	setMaskPanel:function(mpanel){this.maskpanel = mpanel},
	showMaskPanel : function(){
		this.maskpanel.show();
	},
	closePanel:function(){
		this.hide();
		if(this.maskpanel)
			this.maskpanel.hide();
		this.closeHandler();
	},
	openPanel:function(){
		this.setAbsPoint();
		this.show();
		if(this.maskpanel)
			this.maskpanel.show();
		this.openHandler();
	}
})


/* ======== Confirm Panel ======== */
var ConfirmPanel = Class.create();
ConfirmPanel.prototype = Object.extend(Panel.prototype,{
	maskpanel:null,
	okHandler:new Function(),
	cancelHandler:new Function(),
	setMaskPanel:function(mpanel){this.maskpanel = mpanel},
	setButtonHandler:function(ok_handler,cancel_handler){
		this.okHandler = ok_handler;
		this.cancelHandler = cancel_handler || this.cancelHandler;	
	},
	showMaskPanel : function(){
		this.maskpanel.show();
	},
	initConfirm: function(){
		var str="";
		str += '<table border="0" cellpadding="0" cellspacing="0" class="Confirmtable" style="margin:0 0 5px 0"><tr>';
		str += '<td width="50"><div class="question_icon"></div></td>';
		str += '<td><span id="' + this.id + 'confirmText" class="confirmText"></span></td></tr>';
		str += '<tr><td colspan="2" align="center"><input type="button" name="Submit2" value="确定" class="button" ';
		str += 'onclick="' + this.id + '.btOk_click();"/> '
		str += '<input type="button" name="Submit22" value="取消" class="button" ';
		str += 'onclick="' + this.id + '.btCancel_click();"/></td>';
		str += '</tr></table>'
		this.content.innerHTML = str;
		this.content.style.background = "#fff";
	},
	setConfirmText:function(str){
		$(this.id + "confirmText").innerHTML = str;
	}, 
	openPanel:function(){
		this.setAbsPoint();
		this.show();
		if(this.maskpanel)
			this.maskpanel.show();
		this.openHandler();
	},
	closePanel:function(){
		this.hide();
		if(this.maskpanel)
			this.maskpanel.hide();
		this.closeHandler();
	},
	btOk_click:function(){
		this.closePanel();
		this.okHandler();
	},
	btCancel_click:function(){
		this.closePanel();
		this.cancelHandler();
	}
})

/* ======== Progress Panel ======== */
var ProgressPanel = Class.create();
ProgressPanel.prototype = Object.extend(Panel.prototype,{
	maskpanel:null,
	setMaskPanel:function(mpanel){this.maskpanel = mpanel},
	showMaskPanel : function(){
		this.maskpanel.show();
	},
	initProgress: function(){
		var str="";
		str += '<table border="0" cellpadding="0" cellspacing="0" class="Confirmtable" style="margin:0 0 5px 0"><tr>';
		str += '<td width="50"><div class="progress_icon"></div></td>';
		str += '<td><span id="' + this.id + 'progressText" class="confirmText"></span></td></tr>';
		//str += '<td><b><marquee align="left" hspace="50" vspace="20"><span id="' + this.id + 'progressText" class="progressText"></span></marquee></b></td></tr>';
		str += '</tr></table>';
		this.head.style.display = "none";
		this.content.innerHTML = str;
		this.content.style.background = "#fff";
	},
	setProgressText:function(str){
		$(this.id + "progressText").innerHTML = str;
	}, 
	openPanel:function(){
		this.setAbsPoint();
		this.show();
		if(this.maskpanel)
			this.maskpanel.show();
		this.openHandler();
	}
})

/* ======== Message Panel ======== */
var MessagePanel = Class.create();
MessagePanel.prototype = Object.extend(Panel.prototype,{
	maskpanel:null,
	setMaskMessagePanel:function(mpanel){this.maskpanel = mpanel},
	showMaskMessagePanel : function(){
		this.maskpanel.show();
	},
	initMessage: function(){
		var str="";
		str += '<table border="0" cellpadding="0" cellspacing="0" class="detailTable" style="margin:0 0 5px 0"><tr>';
		str += '<td width="50"><div class="question_icon"></div></td>';
		str += '<td><span id="' + this.id + 'confirmText" class="confirmText"></span></td></tr>';
		str += '<tr><td colspan="2" align="center"><input type="button" name="Submit2" value="确认" class="button" ';
		str += 'onclick="' + this.id + '.btOk_Message_click();"/> </td>';
		str += '</tr></table>'
		this.content.innerHTML = str;
		this.content.style.background = "#fff";
	},
	setMessageText:function(str){
		$(this.id + "confirmText").innerHTML = str;
	}, 
	openMessagePanel:function(){
		this.setAbsPoint();
		this.show();
		if(this.maskpanel)
			this.maskpanel.show();
		this.openHandler();
	},
	closePanel:function(){
		this.hide();
		if(this.maskpanel)
			this.maskpanel.hide();
		this.closeHandler();
	},
	btOk_Message_click:function(){
		this.closePanel();
	}
})
